// superMap for openlayers 地图基础类
import CoordTransformUtils from './CoordTransformUtils'

const coordTransform = new CoordTransformUtils()

const ol = window.ol
console.log('openlayers父类', ol)

class BasicMap {
  constructor() {
    this.map = '' // 地图实例
    this.mapView = ''
    this.layers = [] // 地图初始图层
    // this.url = 'http://online3.map.bdimg.com/onlinelabel/?qt=tile&x={x}&y={y}&z={z}&styles={styles}&udt=20170408' // 线上外网瓦片地址
    this.url = process.env.VUE_APP_BMAP_URL

    this.mapCenter = [108.324573, 22.828084] // 地图中心点
    this.coordTransform = coordTransform // 挂在坐标系转换工具类
    this.initMap()
    this.initInteraction()
  }

  initMap() {
    const centerPoint = new ol.geom.Point(this.mapCenter)
    this.coordTransform.convertGeoIntoMap(centerPoint)
    const hidpi = false
    this.url = this.url.replace('{styles}', hidpi ? 'ph' : 'pl')
    const tileGrid = new ol.tilegrid.TileGrid({
      extent: [-33554432, -33554432, 33554432, 33554432],
      resolutions: [131072 * 2, 131072, 65536, 32768, 16284, 8192, 4096, 2048, 1024, 512, 256, 128, 64, 32, 16, 8, 4, 2, 1, 0.5],
      origin: [0, 0],
      minZoom: 3
    })
    const layer = new ol.layer.Tile({
      source: new ol.source.TileImage({
        projection: ol.proj.get('EPSG:3857'),
        tileGrid: tileGrid,
        tileUrlFunction: tileCoord => {
          const tempUrl = this.url.replace('{z}', tileCoord[0].toString())
            .replace('{x}', tileCoord[1].toString())
            .replace('{y}', function () {
              const y = -tileCoord[2] - 1
              return y.toString()
            })
            .replace('{-y}', function () {
              const z = tileCoord[0]
              const range = tileGrid.getFullTileRange(z)
              ol.asserts.assert(range, 55) // The {-y} placeholder requires a tile grid with extent
              const y = range.getHeight() + tileCoord[2]
              return y.toString()
            })
          return tempUrl
        }
      })
    })
    this.layers.push(layer)
    this.mapView = new ol.View({
      center: centerPoint.getCoordinates(),
      zoom: 13,
      minZoom: 4,
      minResolution: 32768,
      resolutions: [131072 * 2, 131072, 65536, 32768, 16284, 8192, 4096, 2048, 1024, 512, 256, 128, 64, 32, 16, 8, 4, 2, 1, 0.5]
    })
    this.map = new ol.Map({
      target: 'map-container',
      controls: ol.control.defaults({
        attributionOptions: {
          collapsed: false
        },
        zoom: false
      }).extend([new ol.supermap.control.Logo()]),
      view: this.mapView,
      layers: this.layers
    })
  }

  // 初始化交互事件
  initInteraction() {
    this.map.on('pointermove', e => {
      const pixel = this.map.getEventPixel(e.originalEvent)
      const feature = this.map.forEachFeatureAtPixel(pixel, feature => {
        return feature
      })
      if (feature) {
        if (feature.get('userData') && feature.get('userData').type && feature.get('userData').type === 'marker') {
          this.map.getTargetElement().style.cursor = 'pointer'
        } else {
          this.map.getTargetElement().style.cursor = ''
        }
      } else {
        this.map.getTargetElement().style.cursor = ''
      }
    })
  }
}

export default BasicMap
